<template>
	<div class="edit-popup">
		<popup ref="popupRef" :title="popupTitle" :async="true" width="550px" :clickModalClose="true"
			@confirm="handleSubmit" @close="handleClose">
			<el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
				<!-- 账号输入框 -->
				<el-form-item label="名称" prop="title">
					<el-input v-model="formData.title" :disabled="formData.root == 1" placeholder="请输入仓库名称"></el-input>
				</el-form-item>
				<el-form-item label="备注">
					<el-input v-model="formData.remark" type="textarea" :rows="4" :disabled="formData.root == 1"
						placeholder="请输入备注"></el-input>
				</el-form-item>
				<el-form-item label="入库">
					<el-tree :data="options.rk_value" :check-strictly="false" :default-checked-keys="formData.rk_value" node-key="id" show-checkbox
						:props="defaultProps" @check="handleNodeClickrk" />

				</el-form-item>
				<el-form-item label="调拨">
					<el-tree :data="options.db_value" :check-strictly="false" :default-checked-keys="formData.db_value" node-key="id" show-checkbox
						:props="defaultProps" @check="handleNodeClickdb" />
				</el-form-item>
				<el-form-item label="作废">
					<el-tree :data="options.zf_value" :check-strictly="false" :default-checked-keys="formData.zf_value" node-key="id" show-checkbox
						:props="defaultProps" @check="handleNodeClickzf" />
				</el-form-item>
			</el-form>
			<!-- <auth-popup v-if="showAuth" ref="authRef" @success="getLists" @close="showAuth = false" /> -->
		</popup>
	</div>
</template>
<script lang="ts" setup>
	import type {
		FormInstance
	} from 'element-plus'
	import Popup from '@/components/popup/index.vue'

	import {
		adminjurisdictionedit,
		adminjurisdictionadd,
		adminjurisdictiongetPermissions
	} from '@/api/warehouse/list'
	import {
		deptLists
	} from '@/api/org/department'
	import {
		jobsLists
	} from '@/api/org/post'
	// import AuthPopup from './auth.vue'
	const authRef = shallowRef < InstanceType < typeof AuthPopup >> ()
	const emit = defineEmits(['success', 'close'])
	const formRef = shallowRef < FormInstance > ()
	const popupRef = shallowRef < InstanceType < typeof Popup >> ()
	const mode = ref('add')
	const popupTitle = computed(() => {
		return mode.value == 'edit' ? '编辑权限' : '新增权限'
	})
	const defaultProps = {
		children: 'data',
		label: 'title',
	}
	const getLists = () => {

	}
	const formData = reactive({
		id:'',
		title: '',
		db_value: [],
		rk_value: [],
		zf_value: [],
		remark: ''
	})
	const showAuth = ref(true)

	const formRules = reactive({
		title: [{
			required: true,
			message: '请输入仓库名称',
			trigger: ['blur']
		}],
	})
	const options = reactive({
		db_value: [] as any[],
		rk_value: [] as any[],
		zf_value: [] as any[],
		jobs: [] as any[]
	})
	const handleNodeClickrk = (data: any, index: any) => {
		// console.log('handleNodeClick',index.checkedKeys)
		formData.rk_value = index.checkedKeys
	}
	const handleNodeClickdb = (data: any, index: any) => {
		// console.log('handleNodeClick', data, index.checkedKeys)
		formData.db_value = index.checkedKeys
	}
	const handleNodeClickzf = (data: any, index: any) => {
		// console.log('handleNodeClick', data, index.checkedKeys)
		formData.zf_value = index.checkedKeys
	}
	
	const getOptions = () => {
		adminjurisdictiongetPermissions({
			page_type: 0
		}).then((data: any) => {
			options.db_value = data.db_value
			options.rk_value = data.rk_value
			options.zf_value = data.zf_value
			
		})
		deptLists({
			page_type: 0
		}).then((data: any) => {
			options.dept = data
		})
		jobsLists({
			page_type: 0
		}).then((data: any) => {
			options.jobs = data.lists
		})
	}

	const handleSubmit = async () => {
		await formRef.value?.validate()
		mode.value == 'edit' ? await adminjurisdictionedit(formData) : await adminjurisdictionadd(formData)
		popupRef.value?.close()
		emit('success')
	}

	const open = (type = 'add') => {
		mode.value = type
		popupRef.value?.open()
	}

	const setFormData = (data: Record < any, any > ) => {
		for (const key in formData) {
			if (data[key] != null && data[key] != undefined) {
				//@ts-ignore
				if (data.type) {
					data.type = Number(data.type)
				}
				formData[key] = data[key]
			}
		}
	}

	const handleClose = () => {
		emit('close')
	}

	getOptions()

	defineExpose({
		open,
		setFormData
	})
</script>
